<%-- 
    Document   : centralContent
    Created on : May 11, 2012, 8:21:28 PM
    Author     : DAIDUONG
    Comment    : Trang Home trinh bay giong trang boxCategory nhung khac la trang home the hien san pham theo thu tu thoi gian  
--%>


<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="public/js/jquery/jquery.pajinate.js"></script>

<script type="text/javascript">
					
			$.noConflict();
			jQuery(document).ready(function($) {
			 
				$('#central_content').pajinate({
					items_per_page : 6,
					item_container_id : '.central_products2',
					nav_panel_id : '#next_page',
					num_page_links_to_display : 5,
						nav_label_first : '<<',
						nav_label_last : '>>',
						nav_label_prev : '<',
						nav_label_next : '>'
				});
			});	
		
</script>

<%@ taglib prefix="s" uri="/struts-tags" %>



<!-- BEGIN #central_content -->
    
    <div id="central_content" class="container"> 
      
      <!-- BEGIN central slogan and rss feed -->
      <div class="question1 ha"></div>
      <div class="question2 ha"></div>
      <div id="view_option">
        <div id="show">Show:</div>
        <div id="console" style="width:0; font-family: 'Courier New', monospace; height: 0px; display:none"></div>
        <!-- needed for the custom select -->
        
        <div class="cat_opt_button_container">
          <div id="o_switcher" class="o_switcher"> <span class="o_selected"><a href="">Default</a></span>
            <ul class="o_options">
              <li><a href="">Default</a></li>
              <li><a href="">Name</a></li>
              <li><a href="">Price(low to high)</a></li>
              <li><a href="">Price(high to low)</a></li>
            </ul>
          </div>
        </div>
        <div id="viewmode"> <a href="category-page.html"><span id="view1"></span></a>
          <div id="view2" class="selected"></div>
        </div>
      </div>
      <div style="clear:both;"></div>
      
      <!-- END central slogan and rss feed --> 
      
      <!-- BEGIN central products -->
      <div class="central_products2"> 
        
        <!-- BEGIN product -->
        <s:iterator value="productList" var="product">
	        <div class="item">
	          <div class="item_up"> <a href="product?id=<s:property value="id"/>" class="ptitle2 product_title1"><s:property value="name"/> </a>
	            <a href="public/images/Product_photos/<s:property value="image"/>" class="simple_image" title=""> 
	            <span style="display: none;" class="zoom">
	            	<img src="public/images/ico-zoom.png" alt="Zoom Picture" title="Zoom Picture"/></span> 
	            	<img src="public/images/Product_photos/<s:property value="image"/>" alt="Image 1" title=""/></a>
	            <div class="price">$<s:property value="price"/></div>
	          </div>
	          <div class="add"><a href="cart?id=<s:property value="id"/>"><img src="public/images/add_icon.png" alt="add icon" />ADD TO CART</a></div>
	          <div class="details"><a href="product?id=<s:property value="id"/>">DETAILS</a></div>
	          
	          <!-- END product --> 
	        </div>
        </s:iterator>
        
      </div>
      
      <!-- END central products --> 
      
     <!-- BEGIN navigation bar -->
      <div id="next_page"> <a href="#"> <span class="left_arrow"></span> <span class="left_arrow_hover"></span> </a>
        <div class="page_bar"></div>
        <div class="central_space">
          <div class="central_container"><span class="current_page">Showing 1 to 9 of 45 (5 Pages)</span><span class="page_bar_central"></span><a href="#"><span class="page1 selected">1</span></a><span class="page_bar_central"></span><a href="#"><span class="page2">2</span></a><span class="page_bar_central"></span><a href="#"><span class="page3">3</span></a><span class="page_bar_central"></span><a href="#"><span class="page4">4</span></a><span class="page_bar_central"></span><a href="#"><span class="page5">5</span></a><span class="page_bar_central"></span><a href="#"><span class="others"></span></a></div>
          <div id="page_bar"></div>
        </div>
        <div class="page_bar"></div>
        <a href="#"> <span class="right_arrow"></span> <span class="right_arrow_hover"></span> </a> <!-- END navigation bar --> 
      </div>
      
      <!-- END #central_content--> 
    </div>